<template>
	<div class="store">
		<div class="nav_img">
			<img src="../../public/img/bot/prev.png" alt="" @click="fanhui" class="na1">

			
		</div>
		<div v-for="item in datas" :key='item.id' class="store_nav">
			<img :src="'//elm.cangdu.org/img/'+item.image_path" alt="" class="bac">
			<div class="nav_s"></div>

		

			<div class="left">
				<img :src="'//elm.cangdu.org/img/'+item.image_path" alt="">
			</div>
			<div class="right">
				<p>{{item.name}}</p>
				<p>商家配送／分钟送达／配送费￥5</p>
				<p>{{item.promotion_info}}</p>
			</div>
			<!-- <p v-for="(navs,index) in item.supports" :key='index'>{{navs.description}}</p> -->
		</div>
	</div>
</template>

<script>
	export default{
		name:'store',
		data(){
			return{
				datas:[],
			}
		},
		created() {
			let obj =this
			this.$axios({
				url:'https://elm.cangdu.org/shopping/restaurant/'+this.$route.query.id,
				method:'get',
			}).then(function(res){
				obj.datas.push(res.data);
				window.console.log(res.data.name);
				sessionStorage.setItem('shopName',res.data.name);
				// window.console.log(res.data);
			});
			window.console.log(this.datas.name);
		},
		updated() {
			
		},
		methods: {
			fanhui() {
				this.$router.go(-1);
			}
		}

	}
</script>

<style scoped>
	*{
		margin: 0;
		padding: 0;
	}
	.store{
		position: fixed;
		left: 0;
		top: 0;
		right: 0;

	}
	.bac{
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		width: 100%;
		height: 400%;
		z-index: -2;
		filter: blur(5px); 
		-webkit-filter: blur(15px);
		filter: grayscale(80%);
	/* 	filter: contrast(200%);
		filter: grayscale(80%);
		filter: hue-rotate(190deg); */
/* 		-moz-filter: blur(45px);
		-ms-filter: blur(10px); */
	}
	.nav_s{
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
		z-index: -1;
		background: rgba(0,0,0,0.4);
	}
	.nav_img{
		width: 100%;
		background: #3190e8;
		padding: 5px 0;
		border-bottom: 2px solid #FFFFFF;
	}
	.na1{
		width: 7%;
		margin-left: 5px;
	}
	.store_nav{
		width: 100%;
		position: relative;
		z-index: 1;
		box-sizing: border-box;
		font-size: 12px;
		color: #000000;
		padding: 10px;
		overflow: hidden;
	}
	.left{
		width: 23%;
		float: left;
	}
	.left img{
		width: 90%;
	}
	.right{
		width: 75%;
		margin-left: 2%;
		float: left;
	}
	.right p{
		line-height: 20px;
		color: #FFF0FF;
	}
</style>
